/** 
 * 免登陆功能
 */
function CookieLogin(){
      this.init();
      this.bindEvent();
}
CookieLogin.prototype = {
      constructor : CookieLogin,
      init : function(){
            var cookie_string = getCookie("USRID");
            var nav_list = $("#navbar .nav");
            var user_name = $("#user_name");
            // 判定cookieString里面的内容是否符合我们的json规则;
            var res_json = /^\{[\s*"\w+":"\w+",*\s*]+\}$/;
            if(res_json.test(cookie_string)){
                  nav_list.eq(1).addClass("active");
                  user_name.html(JSON.parse(cookie_string).username);
            }else{
                  nav_list.eq(0).addClass("active");
            }
      },
      bindEvent:function(){
            $("#signout").click(function(){
                  this.signout();
            }.bind(this))
      },
      signout : function(){
            removeCookie("USRID","/");
            location.reload();
      }
}

/**
 * 分页
 */
function Pagination(){
      this.init();
      this.bindEvent();
}

Pagination.prototype = {
      constructor : Pagination,
      init : function(){
            // 从后端加载来的所有数据;
            this.data_g  = null;
            // 商品的总数;
            this.total = null ; 
            // 每页显示的数量
            this.show_count = 4;
            // 当前显示的页码
            this.page_index = 0;
            
            var _ = this;
            // 程序的基本模板;
            class MyMount extends Mount{
                  render(res){
                        var list = res.items;
                        var html = "";

                        for(var i = _.show_count * _.page_index ; i <= _.show_count * _.page_index + 3 ;i ++){
                              // 如果数据为空跳出循环
                              if(!list[i]) break;
                              html += `<div class="col-md-3 goods-item" data-id="${list[i].data.id}" data-index=${ i }>
                                          <img class="img-thumbnail" src="${list[i].data.hd_thumb_url}" alt="">
                                          <p title="${list[i].data.goods_name}">${list[i].data.goods_name}</p>
                                          <h2>${(list[i].data.normal_price / 100) .toFixed(2)}</h2>
                                    </div>`;
                        }
                        return html;
                  }
            }

            this.myMount = new MyMount({
                  url : "/pxx",
                  data : {
                        pdduid: 0,
                        page: 1,
                        size: 30,
                        list_id: "promotion_subject21933_8tdjNJ_spike_1_0",
                        day_type: 1,
                        tab: 0,
                        component_mark: "20190822_sub_21933_秒杀商品-赛马专属-周促",
                        anti_content: "0anAfanUdilYq9dVyruXwHj_G2ZC_tg1CJXZv86_pXSTHnS-tG_XUX5-FFsiAXjkwXMpvfnzLC2JC1mkVEHlT9Hc9sz1v9OzeRNRGjWNlTz9t9hr9fOPodA8ZUoMYMiU2__QxdR_R3zRtD9SrA_8ig2c-Ydk6jviqUSm6Y64SK0iPXzYyNfYbpy1kLMweV-7nHgEIDCrkITSZG7x3IPZxEOVsiho5-QBZyKrcxy7rkaQ3YuYO3u-HZeLOkRka8iWaBwrbey8aVMLzepm1WD8HWJkAaYZdyKcifp7hFFXlXiqRaklGeOXRloGPtml3-PiW1otCXPaI5IgjkesshEf4eFR12RmY7PKrsP6XSxuZm08gueSS0_di9PJ4Ftiwn4BGdnxI02DBKCridiYG9PKV_ld2tZsH9qFBm1HxYKaeZsKHM4YfT5mjKgFUUJ5kGAsl3Veupk_Bo0Z_lY7Zf9dtBBZjBapDXHYf-BymbgqFQmycIPvTMzr4Oyr-sZBHW1zvF-WXG0TuIS5sSknu7lSlrl8biSzDIC3ZzQsHzaAKLPWiB3yulow-yHk9p8y6go0kKY8oEMksn8h0Gc4AEvE-MWAgO8LOUiSjPLhSqG5jbnwcHCh54I3Ypk1iDTMShxthTtQjW5S2NuJ6WMIONyiReJbW6V7iwNOJJ"
                  },
                  main : ".goods-list",
                  loaded : function( res ){
                        // console.log(res);
                        this.total  = res.items.length ;
                        this.data_g = res;
                        this.renderPagination();
                  }.bind(this)
            });

      },
      bindEvent : function(){
            $(".pagination").on("click","li",this.changePage.bind(this)); 
      },
      renderPagination : function(){
            var pagination_html = `<li>
                                          <a href="#" aria-label="Previous">
                                                <span aria-hidden="true">&laquo;</span>
                                          </a>
                                    </li>`;
            for(var i = 0 ; i < Math.ceil(this.total / this.show_count); i++ ){
                  pagination_html += `<li><a href="javascript:void(0)">${i + 1}</a></li>`;
            }
            pagination_html += `<li>
                                    <a href="#" aria-label="Next">
                                          <span aria-hidden="true">&raquo;</span>
                                    </a>
                              </li>`;
            document.querySelector(".pagination").innerHTML = pagination_html;       
      },
      changePage : function(evt){
            var e = evt || event;
            var target = e.target || e.srcElement;
            this.page_index = target.innerText - 1;
            var html = this.myMount.render(this.data_g);
            $(".goods-list").html(html);
      }
}



/**
 * 页面的功能添加;
 */ 

var init_index = $.Callbacks();

init_index.add(function(){
      new CookieLogin();
})

init_index.add(function(){
      new Pagination();
})


/**
 * 启动页面 
 */

$(function(){
      init_index.fire()
})
